<template>
  <div class="dashboard-editor-container">
    <github-corner class="github-corner" />

    <panel-group @handleSetLineChartData="handleSetLineChartData" />

    <div>
      <el-radio @change="changeRadio" v-model="radio" label="1">当月报名学生</el-radio>
      <el-radio @change="changeRadio" v-model="radio" label="2">当月咨询</el-radio>
      <el-radio @change="changeRadio" v-model="radio" label="3">当月网站访问</el-radio>
    </div>

    <el-row style="background:#fff;padding:10px 10px 0;margin-bottom:32px;margin-top: 10px">
      <line-chart :chart-data="lineChartData" />
    </el-row>
    <!--<el-row style="background:#fff;padding:10px 10px 0;margin-bottom:32px;">
      <line-chart :chart-data="lineChartData" />
    </el-row>-->

    <el-row :gutter="32">
      <div class="chart-wrapper">
        <bar-chart />
      </div>
    </el-row>
  </div>
</template>

<script>

import GithubCorner from '@/components/GithubCorner'
import PanelGroup from './components/PanelGroup'
import LineChart from './components/LineChart'
// import RaddarChart from './components/RaddarChart'
// import PieChart from './components/PieChart'
import BarChart from './components/BarChart'
// import TransactionTable from './components/TransactionTable'
import TodoList from './components/TodoList'
import BoxCard from './components/BoxCard'
import { myGet } from '@/utils/myRequest'
import { currentMonthDays } from '@/utils/myUtils'
let info = {
  actualData:[],
  x:[],
  lineName:"报名数"
}
export default {
  name: 'Dashboard',
  components: {
    GithubCorner,
    PanelGroup,
    LineChart,
    //RaddarChart,
    //PieChart,
    BarChart,
    //TransactionTable,
    TodoList,
    BoxCard
  },
  data() {
    return {
      lineChartData: info,
      radio:"1"
    }
  },
  methods: {
    handleSetLineChartData(type) {
      //this.lineChartData = lineChartData[type]
    },

    changeRadio(){
      //console.log(this.radio);
      myGet('/guard/index/index').then(res=>{
        if(res.status){

          if(this.radio=="1"){
            info.actualData = res.data.records.mapDayStudent
            info.x = currentMonthDays();
            info.lineName = "报名数"
          }else if(this.radio=="2"){
            info.actualData = res.data.records.mapDayStudentAsk
            info.xData = currentMonthDays();
            info.lineName = "咨询数"
          }else{
            info.actualData = res.data.records.countSiteScan
            //console.log('111111',res.data.records.countSiteScan)
            info.xData = currentMonthDays();
            info.lineName = "网站访问量"
          }

        }
      })
    }
  },
  mounted() {
    this.changeRadio()
  }
}
</script>

<style lang="scss" scoped>
.dashboard-editor-container {
  padding: 32px;
  background-color: rgb(240, 242, 245);
  position: relative;

  .github-corner {
    position: absolute;
    top: 0px;
    border: 0;
    right: 0;
  }

  .chart-wrapper {
    background: #fff;
    padding: 16px 16px 0;
    margin-bottom: 32px;
  }
}

@media (max-width:1024px) {
  .chart-wrapper {
    padding: 8px;
  }
}
</style>
